@font-face { font-family: 'QM'; src: url('font/QUICKSAND-MEDIUM.TTF') format('truetype'); } @font-face { font-family: 'QB'; src: url('font/QUICKSAND-BOLD.TTF') format('truetype'); } @font-face { font-family: 'KR'; src: url('font/KANIT-REGULAR.TTF') format('truetype'); } /* @font-face { font-family: 'QR'; src: url('font/QUICKSAND-REGULAR.TTF') format('truetype'); } */ @font-face { font-family: 'QSB'; src: url('font/QUICKSAND-SEMIBOLD.TTF') format('truetype'); } :root{ --ThemeColor:#11b0ea; --ThemeColor2:#ed6d00; --paddingLeft:36px; --headHeight:100px; } .i-pic img{height:100%;object-fit:cover;} img.ct{object-fit:contain;} img.cv{object-fit:cover;} *,a *{cursor: none !important;} .pointer2,.pointer{cursor:none !important;} .ly-mousestyle {z-index: 1005;width: 24px;height: 24px;pointer-events: none;mix-blend-mode: exclusion;} .ly-mousestyle-child{width: 100%;height: 100%;mix-blend-mode: exclusion;} .ly-mousestyle-child .svg{width: 100%;height: 100%;fill:rgb(255, 255, 255);mix-blend-mode: exclusion;} .not_info{font-size:18px;font-family:'QM';color:var(--ThemeColor);margin-top:30px;} @media screen and (max-width:750px) { .not_info{font-size:30px;} } .cw1366{max-width:1366px;width:92%;margin:auto;} .cw1180{max-width:1180px;width:92%;margin:auto;} .cw1080{max-width:1080px;width:92%;margin:auto;} /* 导航透明底白字star */ #header{top: 0;left: 0;z-index:10;width:100%;height:var(--headHeight);} /* logo */ #header .logo img{max-height:90%;object-fit:contain;} /* 导航文字 */ #header .hnav{flex:1;} #header .hnav .one_nav{margin-right:var(--paddingLeft);} #header .hnav .one_nav:last-child{margin-right:0;} #header .hnav .one_nav .nav_a{font-size:18px;color:#fff;font-family:'QM';text-align:center;line-height:var(--headHeight);white-space:nowrap;} /* PC端导航下拉 */ #header .hnav .two_nav{min-width:240px;height:0;overflow:hidden;top:calc(var(--headHeight) - 12px);left:-30px;z-index:10;} #header .hnav .two_nav .hnavbg{padding:20px 0;overflow:hidden;border-radius: 20px;background-color: rgb(255, 255, 255);box-shadow: 0px 0px 30px 0px rgba(17, 176, 234, 0.1);} #header .hnav .two_nav .hnavbg .tnav_a{width:100%;padding:0 30px;margin:5px 0;} #header .hnav .two_nav .hnavbg .tnav_a .name{font-size:16px;color:#333;white-space:nowrap;font-family:'QM';line-height:22px;position:relative;width:fit-content;} #header .hnav .two_nav .hnavbg .tnav_a .name::after{content:'';position:absolute;bottom:0;left:0;width:100%;height:7px;background-color: rgba(17, 176, 234 ,0.2);transition: 0.3s;opacity:0;} /* 对比导航 */ #header_nav_width_compare{display: inline-flex;pointer-events: none;position: absolute;top: 0;left: 0;visibility: hidden;opacity: 0;} #header_nav_width_compare .head_nav_list .li{font-size: 18px;margin-left: var(--paddingLeft);} #header_nav_width_compare .head_nav_list .li:first-of-type{margin-left: 0;} /* 右侧 */ #header .hright .search{width:20px;height:20px;margin-left:15px;} #header .hright .search .svg{fill:#f6fafb;width:100%;height:100%;} #header .hright .lang{margin-left:20px;} #header .hright .lang .icon{width:23px;height:23px;} #header .hright .lang .icon .svg{fill:#f6fafb;width:100%;height:100%;} #header .hright .lang .txt{font-size:16px;color:#fff;font-family:'QM';margin-left:10px;} #header .hright .contact{margin-left:20px;font-size:16px;color:#fff;line-height:38px;background-color:var(--ThemeColor);font-family:'QM';width:132px;text-align:center;border-radius:10px;} /* 菜单按钮 */ #header .hright .menu{display:none;width:25px;height:20px;margin-left:20px;} #header .hright .menu .menu_bar{display:block;width:100%;height:2px;background-color:#fff;transform-origin:0;} #header .hright .menu .menu_bar:nth-child(2){width:80%;} #header .hright .menu.cur .menu_bar:nth-child(1){transform:rotateZ(45deg);} #header .hright .menu.cur .menu_bar:nth-child(2){display:none;} #header .hright .menu.cur .menu_bar:nth-child(3){transform:rotateZ(-45deg);} /* 导航透明底白字end * /* 导航占位 */ #m_header_blank{display:none;width:100%;height:var(--headHeight);background-color:transparent;} /* 移动端导航下拉 */ #m_nav{width: 100%;height: 0;z-index:50;left: 0;right: 0;top:var(--headHeight); background: #fff;overflow-y: auto;} #m_nav.cur{height: calc(100vh - var(--headHeight));} #m_nav .nav{width:100%;border-top:1px solid rgba(0, 0, 0, .2);} #m_nav .nav .one_nav .one{padding:0 30px;border-bottom: 1px solid rgba(0, 0, 0, .2);} #m_nav .nav .one_nav .one .icon{width:20px;height:20px;} #m_nav .nav .one_nav .one .icon .svg{width:100%;height:100%;fill:#333;} #m_nav .nav .one_nav.cur .one .icon{transform:rotate(90deg);} #m_nav .nav .one_nav .one .one_a{font-size:18px;line-height:60px;color:#333;font-weight:500;font-family:'MiSans-Medium';} #m_nav .nav .one_nav .two_nav{width: 100%;background: #f7f7f7;} #m_nav .nav .one_nav .two_nav>div{border-bottom: 1px solid rgba(0, 0, 0, .1);} #m_nav .nav .one_nav .two_nav .two_a{font-size: 16px;line-height:50px;color:#333;font-weight:500;padding: 0 30px;font-family:'MiSans-Medium';} /* 导航栏放不下时 */ .header_nav.pc_app #header .hnav{display:none;} .header_nav.pc_app #header .hright .menu{display:block;} @media (any-hover: hover){ /* 导航白底黑字star */ #header.black .logo .img_white{display:none;} #header.black .logo .img_black{display:block;} #header.black .hnav .one_nav .nav_a{color:#333;} #header.black .hright .search .svg, #header.black .hright .lang .icon .svg{fill:#333;} #header.black .hright .lang .txt{color:#333;} #header.black .hright .menu .menu_bar{background-color:#333;} #m_header_blank.black{display:block;height:130px;background:#f8fbfc url('/images/bg/nav-white-bg.png') no-repeat center / cover;} /* 导航白底黑字end */ #header.none{transform:translate3d(0px,-100%,0);} /* #header:hover, */ #header.cur{background-color:#fff;} #header.cur .logo .img_white{display:none;} #header.cur .logo .img_black{display:block;} #header.cur .hnav .one_nav .nav_a{color:#333;} #header.cur .hright .search .svg, #header.cur .hright .lang .icon .svg{fill:#333;} #header.cur .hright .lang .txt{color:#333;} #header.cur .hright .menu .menu_bar{background-color:#333;} #header .hnav .one_nav.cur .nav_a, #header .hnav .one_nav:hover .nav_a{color:var(--ThemeColor);} #header .hnav .two_nav .hnavbg .tnav_a:hover .name{color:var(--ThemeColor);} #header .hnav .two_nav .hnavbg .tnav_a:hover .name::after, #header .hnav .two_nav .hnavbg .tnav_a.cur .name::after{opacity:1;} #header .hnav .two_nav .hnavbg .tnav_a.cur .name{color:var(--ThemeColor);font-family:'QSB';} #header .hright .lang:hover .icon .svg{fill:var(--ThemeColor);} #header .hright .lang:hover .txt{color:var(--ThemeColor);} #header .hright .search:hover .svg{fill:var(--ThemeColor);} #header .hright .contact:hover{background-color:var(--ThemeColor2);} } /* 头部移动端 */ @media screen and (max-width: 1024px) { #header .hnav, #header .hright .contact{display: none;} #header .hright .menu{display: block;} } @media screen and (max-width:750px) { #m_header_blank{display:block;} #header{background-color:#fff;} #header .logo .img_white{display:none;} #header .logo .img_black{display:block;} #header .hright .lang{display: none;} #header .hright .search{width:50px;height:50px;} #header .hright .search .svg{width:40px;height:40px;fill:#333;} #header .hright .menu{width:40px;height:32.5px;} #header .hright .menu .menu_bar{height:4px;background-color:#333;} #m_nav .nav .one_nav .one .one_a{font-size:36px;line-height:100px;} #m_nav .nav .one_nav .one .icon{width:35px;height:35px;} #m_nav .nav .one_nav .two_nav .two_a{font-size:30px;line-height:80px;} #m_nav .bot_box{display:block;margin:50px auto;} #m_nav .bot_box .lang .txt{font-size:36px;color:#333;margin-left:10px;font-weight:500;} #m_nav .bot_box .lang .icon{width:50px;height:50px;} #m_nav .bot_box .lang .icon .svg{width:100%;height:100%;fill:#333;} } /* 首页banner */ #banner{width:100%;overflow:hidden;} #banner .slide::after{content:'';position:absolute;top:0;left:0;z-index:2;width:100%;padding-top:15.885%;background: linear-gradient(180deg, rgba(0,0,0,0.5) 0%, rgba(255,255,255,0) 100%);} #banner .slide::before{content:'';position:absolute;bottom:0;left:0;z-index:2;width:100%;height:60px;background:url('/images/bg/banner-mask.png') no-repeat center bottom / cover;} #banner .slide .slide-inner{width:100%;height:100%;} #banner .slide .slide-inner::after{content:'';position: relative;z-index:1;width:100%;padding-top:44.792%;} #banner .slide .slide-inner video, #banner .slide .slide-inner img{width:100%;height:100%;object-fit:cover;} #banner .info{z-index:5;} #banner .info .title{font-size:90px;line-height:1.1;color:#fff;font-weight:500;} #banner .swiper-pagination-bullets{bottom:60px;} #banner .swiper-pagination-bullets .swiper-pagination-bullet{width:13px;height:13px;background:#fff;opacity:0.3;margin:0 10px;transition:0.3s;border:none;} #banner .swiper-pagination-bullets .swiper-pagination-bullet-active{background:#41bfed;opacity:1;} /* 内页banner */ #inner_banner{width:100%;overflow:hidden;position:relative;} #inner_banner .pic::after{content:'';position:absolute;top:0;left:0;z-index:2;width:100%;padding-top:15.885%;background: linear-gradient(180deg, rgba(0,0,0,0.5) 0%, rgba(255,255,255,0) 100%);} #inner_banner .pic::before{content:'';position:absolute;bottom:0;left:0;z-index:1;width:100%;height:60px;background:url('/images/bg/banner-mask.png') no-repeat center bottom / cover;} #inner_banner .pic video, #inner_banner .pic img{width:100%;object-fit:cover;} #inner_banner .text_box{z-index:5;} #inner_banner .text_box .title{font-size: 56px;font-family: "KR";color:#fff;line-height: 1.4288;} @media (max-width: 1440px){ #banner .info .title, #inner_banner .text_box .title{font-size:50px;} } @media (max-width: 1280px){ #banner .info .title, #inner_banner .text_box .title{font-size:46px;} } @media (max-width: 750px){ #inner_banner .pic::after, #inner_banner .pic::before, #banner .slide::before, #banner .slide::after{display:none;} #banner .slide .slide-inner::after{padding-top:0%;} #banner .slide .slide-inner video, #banner .slide .slide-inner img{position:static; object-fit:contain;} } /* 底部 */ #footer{width:100%;overflow:hidden;padding:80px 0;background:url('/images/bg/footer-bg.png') no-repeat center top / cover;} #footer .top .item{margin-right:8%;} #footer .top .item:nth-child(3){margin:0 0 0 auto;} #footer .top .item:last-child{margin:48px 0 0;} #footer .top .item .tit{font-size: 18px;color:#7f9096;font-family:'QSB';line-height:2;} #footer .top .item .txt{font-size: 30px;color:#0c4f68;font-family:'QB';line-height: 1.2;} #footer .top .item .txt2{font-size: 20px;font-family: "QSB";color:#0c4f67;line-height: 1.8;} #footer .top .item .share{margin-top:6px;} #footer .top .item .share .s{margin-right:10px;width: 50px;height: 50px;border-radius: 50%;background-color: rgba(65, 191, 237,0.2);} #footer .top .item .share .s:last-child{margin-right:0;} #footer .top .item .share .s:hover{transform: translateY(-3px);} #footer .fnav{width:100%;margin:70px 0 18px;} #footer .fnav .li{margin-right:40px;font-size: 18px;color:rgba(0, 0, 0, 0.6);font-family:'QSB';line-height: 2;} #footer .fnav .li:last-child{margin-right:0;} #footer .fnav .li:hover{color:var(--ThemeColor);} #footer .bot .txt{font-size:18px;color: rgba(0, 0, 0, 0.302);font-family:'QM';line-height:1;} @media screen and (max-width:1200px) { #footer .top{gap:3%;} #footer .top .item{margin-right:5%;} #footer .top .item:nth-child(3){margin:0;} #footer .top .item .txt{font-size:26px;} } @media screen and (max-width:1024px) { #footer .top .item{margin-right:3%;} } @media screen and (max-width:750px) { #footer .top .item{width:100%;margin:0 0 30px 0 !important;} #footer .top .item .tit{font-size:30px;} #footer .top .item .txt{font-size:36px;} #footer .top .item .txt2{font-size:26px;} #footer .top .item .share .s{width:70px;height:70px;} #footer .top .item .share .s img{transform:scale(1.5);} #footer .fnav{margin:0 0 30px;} #footer .fnav .li{font-size:32px;} #footer .bot{display:block;} #footer .bot .txt{font-size:26px;line-height:1.6;text-align:center;} } /* 分页 */ .turn_page{margin-top:70px;} .turn_page .svg{fill:#666;} .turn_page .svg.icon_prev{transform:rotate(180deg);} .turn_page .start{margin-right:0.5em;} .turn_page .lyui_paging_btn, .turn_page .lyui_paging_prev, .turn_page .lyui_paging_next{font-size:16px;color:#666;font-family: "QM";min-width:50px;height:50px;border-radius:5px;cursor:pointer;background:#fff;transition:.3s;border:1px solid #e5e5e5;} .turn_page .lyui_paging_btn:hover, .turn_page .lyui_paging_prev:hover, .turn_page .lyui_paging_next:hover, .turn_page .lyui_paging_btn.cur{background-color:var(--ThemeColor);color:#fff;border-color: var(--ThemeColor);} .turn_page .lyui_paging_btn:hover .svg, .turn_page .lyui_paging_prev:hover .svg, .turn_page .lyui_paging_next:hover .svg{fill:#fff;} .turn_page .lyui_paging > font{display:none;} @media (max-width:750px) { .turn_page{margin-top:50px;} .turn_page .svg{transform:scale(1.5);} .turn_page .svg.icon_prev{transform:rotate(182deg) scale(1.5);} .turn_page .lyui_paging_btn, .turn_page .lyui_paging_prev, .turn_page .lyui_paging_next{min-width:60px;height:60px;border-radius:8px;font-size:26px;} } /* 首页 */ .ind_bg{width:100%;background:#f7fafb url('/images/bg/ind-mask.png') no-repeat center bottom / cover;overflow:hidden;} #ind_pureNatural{padding:85px 0 0;} #ind_pureNatural .title{font-size: 46px;font-family: "KR";color: #333;line-height: 1.304;text-align: center;} #ind_pureNatural .brief{font-size: 18px;font-family: "QM";color: #666;line-height: 1.889;text-align: center;margin-top:24px;} /* #ind_pureNatural .list .li{width:calc((100% - (3.276% * 3)) / 4);} */ #ind_pureNatural .list .slide .pic{width:100%;padding-top:97.744%;} /* #ind_pureNatural .list .li:nth-child(2n-1) .pic{clip-path:path('M94.80,35.232 C94.80,35.232 34.558,73.889 9.824,141.149 C-14.908,208.408 16.339,236.331 24.424,242.301 C32.509,248.272 57.270,266.719 98.509,258.457 C139.749,250.195 166.42,252.372 191.706,258.12 C217.370,263.651 264.338,254.186 266.305,188.322 C268.272,122.458 234.420,43.929 206.73,18.651 C177.726,-6.626 149.999,-8.231 94.80,35.232 Z');-webkit-clip-path:path('M94.80,35.232 C94.80,35.232 34.558,73.889 9.824,141.149 C-14.908,208.408 16.339,236.331 24.424,242.301 C32.509,248.272 57.270,266.719 98.509,258.457 C139.749,250.195 166.42,252.372 191.706,258.12 C217.370,263.651 264.338,254.186 266.305,188.322 C268.272,122.458 234.420,43.929 206.73,18.651 C177.726,-6.626 149.999,-8.231 94.80,35.232 Z')} #ind_pureNatural .list .li:nth-child(2n) .pic{clip-path:path('M172.366,225.572 C172.366,225.572 231.902,186.873 256.641,119.541 C281.380,52.209 250.125,24.256 242.38,18.278 C233.951,12.301 209.185,-6.164 167.935,2.105 C126.686,10.376 100.386,8.197 74.716,2.551 C49.46,-3.93 2.67,6.381 0.100,72.316 C-1.866,138.251 31.993,216.866 60.346,242.171 C88.700,267.476 116.433,269.83 172.366,225.572 Z');-webkit-clip-path:path('M172.366,225.572 C172.366,225.572 231.902,186.873 256.641,119.541 C281.380,52.209 250.125,24.256 242.38,18.278 C233.951,12.301 209.185,-6.164 167.935,2.105 C126.686,10.376 100.386,8.197 74.716,2.551 C49.46,-3.93 2.67,6.381 0.100,72.316 C-1.866,138.251 31.993,216.866 60.346,242.171 C88.700,267.476 116.433,269.83 172.366,225.572 Z')} */ #ind_pureNatural .list .slide .name{font-size: 20px;font-family: "QM";color: #333;line-height: 1.8;text-align:center;margin-top:25px;} /* #ind_pureNatural .list .li:last-child .pic{background:url('/images/bg/ind_pureNatural_bg.png') no-repeat center / cover;} */ #ind_pureNatural .list .slide .brief2{font-size: 20px;font-family: "QM";color: #fff;line-height: 1.5;text-align: center;padding:10% 19%;margin-top:0;} #ind_pureNatural .list{padding:72px 0 35px;} #ind_pureNatural .list .swiper-pagination .swiper-pagination-bullet{width:6px;height:6px;background:#41bfed;margin:0 2.5px;transition: 0.3s;} #ind_pureNatural .list .swiper-pagination .swiper-pagination-bullet-active{margin:0 12.5px;} @media screen and (max-width:750px) { #ind_pureNatural{padding:80px 0 0;} #ind_pureNatural .title{font-size:42px;} #ind_pureNatural .brief{font-size:26px;margin-top:20px;} /* #ind_pureNatural .list{flex-wrap:wrap;} #ind_pureNatural .list .li{width:calc((100% - 50px) / 2);margin:50px 0 0 0;} */ #ind_pureNatural .list{padding:30px 0;} #ind_pureNatural .list .slide .name{font-size:30px;margin-top:20px;} #ind_pureNatural .list .slide .brief2{font-size:30px;padding:10% 12%;} #ind_pureNatural .list .swiper-pagination .swiper-pagination-bullet{width:10px;height:10px;} } /* 动画：大小变化 */ @-webkit-keyframes warn{ 0%{opacity:0;-webkit-transform:scale(1);transform:scale(1);} 50%{opacity:1;} to{opacity:0;-webkit-transform:scale(2.5);transform:scale(2.5);} } @keyframes warn{ 0%{opacity:0;-webkit-transform:scale(1);transform:scale(1);} 50%{opacity:1} to{opacity:0;-webkit-transform:scale(2.5);transform:scale(2.5);} } #ind_plantFibers{padding:60px 0;} #ind_plantFibers .title{font-size: 46px;font-family: "KR";color: #333;line-height: 1.304;text-align: center;margin-bottom:45px;} #ind_plantFibers .cont{width:100%;max-width:1280px;} #ind_plantFibers .cont .pic .img{object-fit:contain;width:100%;} #ind_plantFibers .cont .list .li{position:absolute;z-index:2;} /* #ind_plantFibers .cont .list .li:nth-child(1){top:52%;left:-0.5%;} #ind_plantFibers .cont .list .li:nth-child(2){top:66%;left:13%;} #ind_plantFibers .cont .list .li:nth-child(3){top:78%;left:88%;} */ #ind_plantFibers .cont .list .li .btn{width:22px;height:22px;border-radius:50%;background-color:var(--ThemeColor);} #ind_plantFibers .cont .list .li .btn::before{width: 100%;height: 100%;border-radius: 50%;background-color: rgba(17,176,234 ,.3);position: absolute;inset: 0;z-index: -1;content: '';animation: warn 3s ease-out .1s infinite;-webkit-animation: warn 3s ease-out .1s infinite;} #ind_plantFibers .cont .list .li .btn::after{width: 100%;height: 100%;border-radius: 50%;background-color: rgba(17,176,234 ,.2);position: absolute;inset: 0;z-index: -1;content: '';animation: warn 3s ease-out 1.5s infinite;-webkit-animation: warn 3s ease-out 1.5s infinite;} #ind_plantFibers .cont .list .li .btn:hover{background-color:var(--ThemeColor2);} #ind_plantFibers .cont .list .li .btn:hover::before{background-color: rgba(235, 109, 0 ,.3);} #ind_plantFibers .cont .list .li .btn:hover::after{background-color: rgba(235, 109, 0 ,.2);} @media screen and (max-width:750px) { #ind_plantFibers .title{font-size:42px;margin-bottom:30px;} } /* 弹窗 */ #plantFibers_popup.cur{background-color:transparent;} #plantFibers_popup .cw1180{max-width:1180px !important;} #plantFibers_popup .cont{width:100%;background-color:#fff;border-radius:20px;box-shadow: 0px 0px 30px 0px rgba(17, 176, 234, 0.25);overflow-y:auto;padding:45px 50px 42px;max-height:90vh;} /* #plantFibers_popup .cont .list .li{width:130px;} #plantFibers_popup .cont .list .li .pic{width:100%;padding-top:100%;} #plantFibers_popup .cont .list .li .name{font-size: 18px;font-family: "QM";color:var(--ThemeColor);line-height: 30px;text-align: center;} #plantFibers_popup .cont .list .li:hover .name{color:var(--ThemeColor2);} */ #plantFibers_popup .cont .pic img{width:100%;object-fit:contain;} #plantFibers_popup .cont .close{top:20px;right:20px;z-index:2;width:24px;height:24px;} #plantFibers_popup .cont .close .svg{width:100%;height:100%;fill:rgba(0, 0, 0, 0.2);} @media screen and (max-width:750px) { #plantFibers_popup .cont .pic .pc{display: none;} #plantFibers_popup .cont .pic .mb{display: inline-block;} } /* 弹窗end */ #ind_catLitter{padding:35px 0;} #ind_catLitter .title{margin-bottom:62px;font-size: 46px;font-family: "KR";color:#333;line-height: 1.739;text-align:center;} #ind_catLitter .cont .center{width:39.831%;margin:0 2%;position: relative;z-index:2;} #ind_catLitter .cont .center .img{width:100%;padding-top:100%;} #ind_catLitter .cont .list{width:300px;/*transition: transform 1s ease;*/} #ind_catLitter .cont .list .li{width:100%;min-height:160px;padding:18px 25px 58px;border-radius:20px;overflow:hidden;margin-bottom:20px;} #ind_catLitter .cont .list .li:last-child{margin-bottom:0;} #ind_catLitter .cont .list .li .brief{font-size: 18px;font-family: "QM";color:#333;line-height: 1.556;} #ind_catLitter .cont .list .li .icon{position: absolute;right:15px;bottom:15px;z-index:2;width:50px;height:50px;background-color:#fff;border-radius:50%;padding:10px;} #ind_catLitter .cont .left .li:nth-child(1){background-color:#d6edf5;} #ind_catLitter .cont .left .li:nth-child(2){background-color:#eed7eb;} #ind_catLitter .cont .left .li:nth-child(3){background-color:#f5e8dc;} #ind_catLitter .cont .right .li:nth-child(1){background-color:#eef2c0;} #ind_catLitter .cont .right .li:nth-child(2){background-color:#d4f8c4;} #ind_catLitter .cont .right .li:nth-child(3){background-color:#cff1f3;} @media screen and (max-width:750px) { #ind_catLitter{padding:20px 0;} #ind_catLitter .title{font-size:42px;margin-bottom:30px;} #ind_catLitter .cont{display:block} #ind_catLitter .cont .center{margin:30px auto;width:70%;} #ind_catLitter .cont .list{width:100%;} #ind_catLitter .cont .list .li{margin-bottom:30px;padding-bottom:90px;min-height:196px;} #ind_catLitter .cont .list .li .brief{font-size:28px;} #ind_catLitter .cont .list .li .icon{width:80px;height:80px;padding:15px;} } #ind_about{padding:60px 0 70px;width:100%;position:relative;} #ind_about::after{content:'';position:absolute;left:0;bottom:0;z-index:0;width:100%;height:458px;background:url('/images/bg/ind-history-bg.png') no-repeat center bottom / cover;} #ind_about .title{font-size: 46px;font-family: "KR";color:#333;line-height: 1.739;text-align: center;} #ind_about .brief{font-size: 18px;font-family: "QM";color:#666;line-height: 1.667;text-align: center;margin:5px 0 45px;} #ind_about .more{margin:0 auto;padding:0 20px;width:180px;height:65px;border-radius:12px;background-color:var(--ThemeColor);overflow:hidden;position:relative;z-index:2;} #ind_about .more .txt{white-space:nowrap;line-height:1;font-size: 16px;color:#fff;font-family:'QM';padding-bottom:2px;} #ind_about .more .icon{width:14px;height:21px;} #ind_about .more .icon .svg{width:100%;height:100%;stroke:#fff;} #ind_about .more:hover{background-color:var(--ThemeColor2);} #ind_about .cont .container{padding:50px 0 60px;} #ind_about .cont .slide{width:210px;height:251px;pointer-events: none;} #ind_about .cont .slide .top{transform:translateY(46px);padding:0 10px;margin-bottom:15px;} #ind_about .cont .slide .top .icon{width:24px;height:24px;margin:0 auto;} #ind_about .cont .slide .top .icon img{object-fit:contain;} #ind_about .cont .slide .top .year{font-size: 22px;font-family: "QM";color:#333;line-height: 40px;text-align: center;margin:4px 0;} #ind_about .cont .slide .top .name{font-size: 16px;font-family: "QM";color:#666;line-height: 1.25;text-align: center;max-height:60px;overflow-y:auto;} #ind_about .cont .slide .bot{width:100%;height:88px;} #ind_about .cont .slide .bot .line{margin-left:20px;width:1px;height:22px;background:rgba(13,4,2,0.2);} #ind_about .cont .slide .bot .line:nth-child(5n){height:42px;} #ind_about .cont .slide.swiper-slide-active .top{transform:translateY(0);} #ind_about .cont .slide.swiper-slide-active .top .icon{transform:scale(1.211) translateY(-6px);} #ind_about .cont .slide.swiper-slide-active .top .year{font-size:40px;color: var(--ThemeColor2);margin:12px 0;} #ind_about .cont .slide.swiper-slide-active .top .name{color: var(--ThemeColor2);} #ind_about .cont .slide.swiper-slide-active .bot .line{background: linear-gradient(to bottom,rgba(235, 109, 0,0),rgba(235, 109, 0,1));} #ind_about .cont .slide.swiper-slide-active .bot .line:nth-child(5){background:var(--ThemeColor2);height:88px;} #ind_about .cont .slide.swiper-slide-active .bot .line:nth-child(10){background:rgba(13,4,2,0.2);} #ind_about .tips .txt{font-size: 16px;font-family: "QM";color: #666;margin-left:15px;} #ind_about .tips .icon{width:28px;height:28px;} #ind_about .tips .icon .svg{width:100%;height:100%;fill:#666;} @media screen and (min-width:1025px) { #ind_about .cont .slide{pointer-events: none;} #ind_about .cont .slide[progress='0'], #ind_about .cont .slide[progress='1'], #ind_about .cont .slide[progress='2'], #ind_about .cont .slide[progress='-1'], #ind_about .cont .slide[progress='-2']{pointer-events:all;} #ind_about .cont .slide .top{opacity:0;} #ind_about .cont .slide[progress='0'] .top, #ind_about .cont .slide[progress='1'] .top, #ind_about .cont .slide[progress='2'] .top, #ind_about .cont .slide[progress='-1'] .top, #ind_about .cont .slide[progress='-2'] .top{opacity:1;} } @media screen and (max-width:1024px) { #ind_about .cont .slide{pointer-events:all;} } @media screen and (max-width:750px) { #ind_about .title{font-size:42px;} #ind_about .brief{font-size:26px;margin-bottom:30px;} #ind_about .more{width:220px;height:70px;} #ind_about .more .txt, #ind_about .tips .txt{font-size:26px;} #ind_about .tips .icon {width: 40px;height: 40px;} #ind_about .cont .container{padding-top:30px;} #ind_about .cont .slide{width:410px;height:320px;} #ind_about .cont .slide .top .icon{width:40px;height:40px;} #ind_about .cont .slide .top .icon img{height:100%;} #ind_about .cont .slide .top .year{font-size:42px;margin:12px 0;} #ind_about .cont .slide .top .name{font-size:26px;max-height:97.5px;} #ind_about .cont .slide .bot .line{margin-left:40px;} } #ind_blog{padding-top:20px;} #ind_blog .title{font-size: 46px;color:#333;line-height: 1.739;font-family:'KR';text-align:center;} #ind_blog .container{max-width:1180px;width:100%;padding:35px 0 32.5px;} #ind_blog .container .swiper-pagination{display:none;} #ind_blog .container .swiper-pagination .swiper-pagination-bullet{width:6px;height:6px;background:#41bfed;margin:0 2.5px;transition: 0.3s;} #ind_blog .container .swiper-pagination .swiper-pagination-bullet-active{margin:0 12.5px;} #ind_blog .slide{height:auto;border-radius:30px;background-color:#fff;} #ind_blog .slide .pic{width:100%;padding-top:66.578%;border-radius:30px 30px 12px 12px;} #ind_blog .slide .info{width:100%;padding:22px 30px 60px;} #ind_blog .slide .info .name{font-size: 22px;color:#333;line-height: 1.455;text-align: center;font-family:'QM';} #ind_blog .slide .info .text{font-size: 16px;color:#999;line-height: 2.125;text-align: center;font-family:'QM';margin-top:16px;} #ind_blog .slide .info .more{display:block;position:absolute;z-index:2;bottom:-32.5px;left:50%;transform:translateX(-50%);} #ind_blog .slide .info .more .btn{padding:0 20px;width:65px;height:65px;border-radius:50%;background-color:var(--ThemeColor);overflow:hidden;position:relative;} #ind_blog .slide .info .more .btn .txt{position:absolute;left:0;transform:translateX(-100%);opacity:0;white-space:nowrap;line-height:1;font-size: 16px;color:#fff;font-family:'QM';padding-bottom:2px;} #ind_blog .slide .info .more .btn .icon{width:14px;height:21px;} #ind_blog .slide .info .more .btn .icon .svg{width:100%;height:100%;stroke:#fff;} #ind_blog .slide .info .more .btn:hover{width: 180px;background-color:var(--ThemeColor2);border-radius: 12px;justify-content:space-between;} #ind_blog .slide .info .more .btn:hover .txt{opacity:1;transform:translateX(0);position:static;} #ind_blog .cont .pn{position:absolute;top:50%;transform: translateX(-50%);z-index:2;width:18px;height:29px;} #ind_blog .cont .pn .svg{width:100%;height:100%;stroke:#41bfed;} #ind_blog .cont .pn.prev .svg{transform:rotate(180deg);} #ind_blog .cont .pn:hover .svg{stroke: var(--ThemeColor2);} #ind_blog .cont .pn.prev{left:0;} #ind_blog .cont .pn.next{right:0;} @media screen and (max-width:750px) { #ind_about .title{font-size:42px;} #ind_blog .container{padding-bottom:70px;} #ind_blog .container .swiper-pagination{display:block;} #ind_blog .container .swiper-pagination .swiper-pagination-bullet{width:10px;height:10px;} #ind_blog .slide .info .name{font-size:30px;} #ind_blog .slide .info .text{font-size:26px;} #ind_blog .slide .info .more .btn{width:70px;height:70px;} #ind_blog .slide .info .more .btn:hover{width:220px;} #ind_blog .slide .info .more .btn .txt{font-size:26px;} } #ind_honor{padding:95px 0;width:100%;overflow:hidden;position:relative;background:url('/images/bg/ind-honor-bg.png') no-repeat center / cover;background-blend-mode: multiply;} #ind_honor .title{margin-bottom:62px;font-size: 46px;color:#333;line-height: 1.739;font-family:'KR';text-align:center;} #ind_honor .cont .slide{padding:0 3.39%;} #ind_honor .cont .slide .pic{width:100%;padding-top:135.185%;z-index:2;} #ind_honor .cont .slide .pic::after{content:'';position:absolute;bottom:0;left:-40px;width:40px;height:20px;background:url('/images/bg/ind-honor-mask.png') no-repeat left bottom / cover;} #ind_honor .cont .slide .pic img{height:100%;object-fit:contain;} #ind_honor .cont .slide .pic .show_icon{opacity:0;position:absolute;right:40px;bottom:40px;width:23px;height:23px;z-index:3;} #ind_honor .cont .slide .pic .show_icon .svg{width:100%;height:100%;fill:#000;} #ind_honor .cont .slide .pic:hover .show_icon{opacity:1;} #ind_honor .cont .slide .name{margin:40px 0 0 0;text-align:center;font-size: 20px;font-family: "QM";color:#666;line-height: 1.2;} #ind_honor .cont .pn{position:absolute;top:55%;z-index:2;width:18px;height:29px;} #ind_honor .cont .pn .svg{width:100%;height:100%;stroke:#41bfed;} #ind_honor .cont .pn.prev .svg{transform:rotate(180deg);} #ind_honor .cont .pn:hover .svg{stroke: var(--ThemeColor2);} #ind_honor .cont .pn.prev{left:0;} #ind_honor .cont .pn.next{right:0;} @media screen and (max-width:1280px) { #ind_honor{background-position-y:-12px;} } @media screen and (max-width:1024px) { #ind_honor{background-position-y:-22px;} } @media screen and (max-width:750px) { #ind_honor{padding:80px 0;background-position-y:88px;} #ind_honor .title{font-size:42px;margin-bottom:30px;} #ind_honor .cont .slide{padding:0 50px;} #ind_honor .cont .slide .name{font-size:30px;margin-top:30px;} #ind_honor .cont .slide .pic .show_icon{opacity:1;width:50px;height:50px;} } #ind_reviews{width:100%;padding:25px 0 55px;} #ind_reviews .title{font-size: 46px;color:#333;line-height: 1.739;font-family:'KR';text-align:center;margin-bottom:30px;} #ind_reviews .cont{padding-bottom:50px;} #ind_reviews .cont::after{content:'';position: absolute;z-index:2;left:50%;bottom:0;width:472px;height:302px;transform:translate(-50%,0);background:url('/images/bg/reviews-bg.png') no-repeat center / 100%;} #ind_reviews .cont .container{padding:60px 0;z-index:3;} #ind_reviews .cont .slide{padding:0 8%;} #ind_reviews .cont .slide .pic{width:100px;height:100px;border-radius:50%;margin:0 auto;} #ind_reviews .cont .slide .brief{font-size: 20px;font-family: "QM";color: #333;line-height: 1.8;text-align: center;margin:30px 0 25px;} #ind_reviews .cont .slide .name{font-size: 16px;font-family: "QM";color: #666;text-align: center;font-style: italic;} #ind_reviews .cont .container .swiper-pagination{bottom:0;} #ind_reviews .cont .container .swiper-pagination .swiper-pagination-bullet{width:6px;height:6px;background:#41bfed;margin:0 2.5px;transition: 0.3s;} #ind_reviews .cont .container .swiper-pagination .swiper-pagination-bullet-active{margin:0 12.5px;} #ind_reviews .cont .pn{position:absolute;top:50%;z-index:3;width:18px;height:29px;} #ind_reviews .cont .pn .svg{width:100%;height:100%;stroke:#41bfed;} #ind_reviews .cont .pn.prev .svg{transform:rotate(180deg);} #ind_reviews .cont .pn:hover .svg{stroke:var(--ThemeColor2);} #ind_reviews .cont .pn.prev{left:0;} #ind_reviews .cont .pn.next{right:0;} #ind_reviews .list .li{position:absolute;z-index:2;width:72px;height:72px;border-radius:50%;} #ind_reviews .list .li:nth-child(1), #ind_reviews .list .li:nth-child(5){width:82px;height:82px;} #ind_reviews .list .li:nth-child(1){top:20%;left:27%;} #ind_reviews .list .li:nth-child(2){top:26%;right:27%;} #ind_reviews .list .li:nth-child(3){top:45%;left:0;} #ind_reviews .list .li:nth-child(4){top:35%;right:0;} #ind_reviews .list .li:nth-child(5){top:88%;left:18%;} #ind_reviews .list .li:nth-child(6){top:87%;right:17%;} @media screen and (max-width:1024px) { #ind_reviews .cont .slide{padding:0 50px;} } @media screen and (max-width:750px) { #ind_reviews{padding:0 0 50px;} #ind_reviews .title{font-size:42px;margin-bottom:10px;} #ind_reviews .cont::after{bottom:10%;} #ind_reviews .cont .container{padding-bottom:30px;} #ind_reviews .cont .container .swiper-pagination .swiper-pagination-bullet{width:10px;height:10px;} #ind_reviews .cont .slide .brief{font-size:26px;margin:20px 0;} #ind_reviews .cont .slide .name{font-size:26px;} } #ind_touch{width:100%;padding:135px 0;overflow:hidden;} #ind_touch .cont{width:100%;background-color:#fff;border-radius:20px;} #ind_touch .cont .form{width:100%;padding:80px 11.112%;} #ind_touch .cont .form .title{margin-bottom:56px;line-height:1;font-size: 46px;color:#333;font-family:'KR';text-align:center;} #ind_touch .cont .form .com::placeholder{color:#999;transition:all 0.3s linear;} #ind_touch .cont .form .com::-moz-placeholder{color:#999;} #ind_touch .cont .form .com::-webkit-input-placeholder{color:#999;} #ind_touch .cont .form .com:hover::placeholder{color:#333;} #ind_touch .cont .form .com:hover::-moz-placeholder{color:#333;} #ind_touch .cont .form .com:hover::-webkit-input-placeholder{color:#333;} #ind_touch .cont .form .com{display:block;font-size:18px;font-family:'QM';color:#333;border-bottom:2px solid #e3f5fb;padding-bottom:8px;transition:all 0.3s linear;} #ind_touch .cont .form .com:hover{border-color:var(--ThemeColor);} #ind_touch .cont .form .list .inp{width:calc((100% - 40px) / 2);margin-bottom:30px;line-height: 2;} #ind_touch .cont .form .list .inp:nth-child(2n){margin-left:40px;} #ind_touch .cont .form .text{width:100%;height:120px;line-height:1.6;padding-top:14px;} #ind_touch .cont .form .btn{margin:60px auto 0;padding:0 20px;border-radius:12px;background-color: var(--ThemeColor);width: 220px;height: 65px;} #ind_touch .cont .form .btn .txt{font-size: 16px;color:#fff;font-family:'QM';padding-bottom:2px;} #ind_touch .cont .form .btn .icon{width:14px;height:21px;} #ind_touch .cont .form .btn .icon .svg{stroke:#fff;width:100%;height:100%;} #ind_touch .cont .form .btn:hover{background-color:var(--ThemeColor2);} #ind_touch .cont .beast{background:url() no-repeat center / 100%;} #ind_touch .cont .animal1{top:-85px;left:-40px;width:160px;height:116px;background-image:url('/images/icon/animal1.png');} #ind_touch .cont .animal2{top:-100px;right:0;width:189px;height:119px;background-image:url('/images/icon/animal2.png');} #ind_touch .cont .animal3{bottom:-70px;left:-70px;width:130px;height:217px;background-image:url('/images/icon/animal3.png');} #ind_touch .cont .animal4{bottom:-10px;right:-70px;width:322px;height:210px;background-image:url('/images/icon/animal4.png');} @media screen and (max-width:1024px) { #ind_touch .cont .animal3{left:-30px;} #ind_touch .cont .form{padding:80px 6%;} } @media screen and (max-width:750px) { #ind_touch{padding:120px 0;} #ind_touch .cont .form .title{font-size:42px;margin-bottom:50px;} #ind_touch .cont .form .com{font-size:30px;} #ind_touch .cont .form .list .inp{width:100%;margin-bottom:10px;padding-bottom:10px;} #ind_touch .cont .form .list .inp:nth-child(2n){margin-left:0;} #ind_touch .cont .form .text{height:180px;} #ind_touch .cont .form .btn{width:240px;height:70px;} #ind_touch .cont .form .btn .txt{font-size:26px;} } /* 关于我们 */ .about_bg{width:100%;background:#f7fafb url('/images/bg/about-bg.png') no-repeat center bottom / cover;/*overflow:hidden;*/} #pet_division{padding:80px 0 60px;overflow:hidden;} #pet_division .cont .left{width:52.543%;} #pet_division .cont .left .title{font-size: 46px;font-family: "KR";color: rgb(51, 51, 51);margin-bottom:15px;} #pet_division .cont .left .brief{font-size: 18px;font-family: "QM";color: rgb(102, 102, 102);line-height: 1.667;} #pet_division .cont .right{width:34.746%;} #pet_division .cont .right .pic{width:100%;padding-top:89.024%;} #pet_division .list{width:100%;margin-top:42px;padding:30px 4.238% 34px;border-radius: 30px;background-color: rgb(230, 243, 248);} #pet_division .list .li{width:calc((100% - (10% * 2)) / 3);} #pet_division .list .li .icon{width:36px;margin:10px 25px 0 0;} #pet_division .list .li .info .tit{font-size: 24px;font-family: "KR";color: rgb(51, 51, 51);margin-bottom:5px;} #pet_division .list .li .info .txt{font-size: 16px;font-family: "QM";color: rgb(102, 102, 102);line-height: 1.5;} @media screen and (max-width:1024px) { #pet_division .list .li{width:calc((100% - (4% * 2)) / 3);} } @media screen and (max-width:750px) { #pet_division .cont{display: block;} #pet_division .cont .left{width: 100%;} #pet_division .cont .left .title{font-size:42px;} #pet_division .cont .left .brief{font-size:28px;line-height:1.6;} #pet_division .cont .right{width: 100%;margin-top:30px;} #pet_division .cont .right .pic img{min-width:80%;} #pet_division .list{display: block;padding:30px;} #pet_division .list .li{width:100%;margin-bottom:50px;} #pet_division .list .li:last-child{margin-bottom:0;} #pet_division .list .li .icon{width:50px;} #pet_division .list .li .icon img{width:100%;object-fit:contain;} #pet_division .list .li .info .tit{font-size:34px;} #pet_division .list .li .info .txt{font-size:26px;} } #our_brand{padding:60px 0 30px;} #our_brand .title{margin-bottom:60px;font-size: 46px;font-family: "KR";color: rgb(51, 51, 51);line-height: 1;text-align: center;} /* 英文版 */ #our_brand .list .li{width:calc((100% - (20px * 2)) / 3);height:200px;padding:30px;margin:0 20px 20px 0;border-radius: 30px;background-color: rgb(251, 253, 253);} #our_brand .list .li:nth-child(3n){margin-right:0;} #our_brand .list .li .box{border-radius: 30px;background-color: rgb(255, 255, 255);box-shadow: 0px 0px 30px 0px rgba(17, 176, 234, 0.1);left: -30px;top: 50%;transform: translateY(-50%) scale(0);width: 400px;/*height:500px;*/overflow:hidden;z-index: 2;} #our_brand .list .li .box .info{width:100%;max-height:500px;padding:30px;} #our_brand .list .li .box .info .top{padding:30px 0;height:160px;} #our_brand .list .li .box .info .bot{height:calc(100% - 160px); overflow-y:auto;} #our_brand .list .li .box .info .bot .brief{font-size: 16px;font-family: "QM";color: rgb(102, 102, 102);line-height: 1.5;padding-left:15px;position:relative;margin-bottom:16px;} #our_brand .list .li .box .info .bot .brief:last-child{margin-bottom:0;} #our_brand .list .li .box .info .bot .brief::after{content:'';position:absolute;left:0;top:10px;width:5px;height:5px;border-radius:50%;background:var(--ThemeColor);} #our_brand .list .li:hover .box{transform: translateY(-50%) scale(1);} /* 中文版 */ #our_brand .ul .item{width:100%;position:sticky;top:0;margin-bottom:20px;} #our_brand .ul .item:last-child{margin-bottom:0;} #our_brand .ul .item .pic{width:100%;padding-top:38.983%;border-radius:30px;} @media screen and (max-width:1024px) { #our_brand .list .li .box{width:300px;left:0;} #our_brand .list .li .box .info{max-height:400px;} } @media screen and (max-width:750px) { #our_brand .title{font-size:42px;margin-bottom:50px;} #our_brand .list{display: block;} #our_brand .list .li{width:100%;height:300px;margin-bottom:50px;} #our_brand .list .li:last-child{margin-bottom:0;} #our_brand .list .li .pic{width:100%;height:100%;} #our_brand .list .li .pic img{min-width:60%;} #our_brand .list .li .box{width:100%;} #our_brand .list .li .box .info{max-height:600px;} #our_brand .list .li .box .info .bot .brief{font-size:26px;padding-left:30px;} #our_brand .list .li .box .info .bot .brief::after{top:16px;width:10px;height:10px;} #our_brand .list .li .box .info .pic img{min-width: auto;height:100%;} #our_brand .ul .item{position:static;} } #odm_service{padding:60px 0;} #odm_service .title{font-size: 46px;font-family: "KR";color: rgb(51, 51, 51);line-height: 1;text-align: center;margin-bottom:25px;} #odm_service .brief{font-size: 18px;font-family: "QM";color: rgb(102, 102, 102);line-height: 1.667;text-align: center;} #odm_service .cont{padding-top:55px;} #odm_service .cont .li{width:calc(100% / 7);} #odm_service .cont .li .center{width:100%;margin:30px 0 25px;position: relative;} #odm_service .cont .li .icon{width:50px;height:43px;} #odm_service .cont .li .numb{position: relative;z-index:2;border-radius: 50%;background-color: rgb(17, 176, 234);width: 28px;height: 28px;font-size: 16px;font-family: "QM";color: rgb(255, 255, 255);} #odm_service .cont .li .line{background-color: rgba(17, 176, 234,0.102);width:50%;height: 28px;position: absolute;top:50%;transform: translateY(-50%);left:0;} #odm_service .cont .li .line::after{content:'';position:absolute;width: 100%;height: 2px;background-color:var(--ThemeColor);left:0;top:50%;transform: translateY(-50%);} #odm_service .cont .li .line.line2{right: 0;left: auto;} #odm_service .cont .li .line.line2 .lyicon{font-size:14px;font-weight:bold;color:var(--ThemeColor);position: absolute;right:-8px;top:50%;transform: translateY(-50%);} #odm_service .cont .li .name{font-size: 18px;font-family: "QM";color: rgb(51, 51, 51);text-align: center;padding:0 10px;} @media screen and (max-width: 750px) { #odm_service .title{font-size:42px;} #odm_service .brief{font-size:28px;} #odm_service .cont .li{width:calc(100% / 3);} #odm_service .cont .li .name{font-size:28px;} #odm_service .cont .li .numb{width:40px;height:40px;font-size:20px;} #odm_service .cont .li .line.line2 .lyicon{font-size:20px;} } #odm_factory{padding:50px 0;overflow: hidden;} #odm_factory .cont .left{width: 45.764%;} #odm_factory .cont .left .pic{width: 100%;} #odm_factory .cont .left .pic .img{width:100%;height:100%;object-fit:cover;max-height:366px;border-radius: 30px;} #odm_factory .cont .left .pic .info{padding:10px;border-radius: 30px;background-color: rgba(237, 109, 0,0.8);right: -30px;bottom: -30px;width: 200px;min-height: 140px;z-index: 2;backdrop-filter: blur(10px);} #odm_factory .cont .left .pic .info .icon2{width:20px;} #odm_factory .cont .left .pic .info .txt2{max-width:calc(100% - 20px);padding-left:10px;font-size: 16px;font-family: "QM";color: rgb(255, 255, 255);line-height: 1.25;} #odm_factory .cont .left .pic .info .numb{font-size: 34px;font-family: "QSB";color: rgb(255, 255, 255);line-height:1;margin-top:20px;} #odm_factory .cont .right{width:calc(100% - 45.764% - 7.204%);} #odm_factory .cont .right .title{font-size: 30px;font-family: "KR";color: rgb(51, 51, 51);line-height: 1.333;} #odm_factory .cont .right .company{font-size: 24px;font-family: "KR";color: rgb(51, 51, 51);line-height: 1.667;margin:5px 0 30px;} #odm_factory .cont .right .brief{max-height:204px;overflow-y: auto;} #odm_factory .cont .right .brief .txt{margin-bottom:20px;} #odm_factory .cont .right .brief .txt:last-child{margin-bottom:0;} #odm_factory .cont .right .brief .txt .txt-icon{width:30px;margin-right:18px;} #odm_factory .cont .right .brief .txt .txt-li{flex:1;font-size: 18px;font-family: "QM";color: rgb(51, 51, 51);line-height: 1.5;} @media screen and (max-width: 750px) { #odm_factory .cont{display: block;} #odm_factory .cont .left{width:100%;margin-bottom:50px;} #odm_factory .cont .left .pic .info{right:0;bottom:-50px;width:280px;} #odm_factory .cont .left .pic .info .icon2{width:30px;} #odm_factory .cont .left .pic .info .icon2 img{width: 100%;} #odm_factory .cont .left .pic .info .txt2{font-size:26px;} #odm_factory .cont .right{width:100%;} #odm_factory .cont .right .title{font-size:42px;} #odm_factory .cont .right .company{font-size:34px;line-height:1.6;} #odm_factory .cont .right .brief{max-height:none;} #odm_factory .cont .right .brief .txt .txt-li{font-size:28px;} #odm_factory .cont .right .brief .txt .txt-icon{margin-top:6px;} } #capacity_planning{padding:60px 0;overflow: hidden;} #capacity_planning .cont .left{width:calc(100% - 56.78% - 8.475%);} #capacity_planning .cont .left .title{font-size: 30px;font-family: "KR";color: rgb(51, 51, 51);line-height: 1.333;} #capacity_planning .cont .left .brief{margin-top:30px;max-height:315px;overflow-y:auto;} #capacity_planning .cont .left .brief .txt{margin-bottom:15px;position:relative;padding-left:15px;font-size: 18px;font-family: "QM";color: rgb(102, 102, 102);line-height: 1.5;} #capacity_planning .cont .left .brief .txt:last-child{margin-bottom:0;} #capacity_planning .cont .left .brief .txt::after{content:'';position:absolute;left:0;top:10px;width:5px;height:5px;border-radius:50%;background:var(--ThemeColor);} #capacity_planning .cont .right{width:56.78%;} #capacity_planning .cont .right .li{width:calc((100% - (10px * 3)) / 4);height:400px;border-radius:30px;overflow: hidden;margin-right:10px;} #capacity_planning .cont .right .li.cur{width: calc((100% - (10px * 3)) / 4 * 2 + 10px);} #capacity_planning .cont .right .li:last-child{margin-right:0;} #capacity_planning .cont .right .li img{width:100%;height:100%;object-fit:cover;} @media screen and (max-width: 1024px) { #capacity_planning .cont .left{width: calc(100% - 56.78% - 30px);} } @media screen and (max-width: 750px) { #capacity_planning .cont{display: block;} #capacity_planning .cont .left{width:100%;margin-bottom:50px;} #capacity_planning .cont .left .title{font-size: 40px;} #capacity_planning .cont .left .brief{max-height:none;} #capacity_planning .cont .left .brief .txt{font-size: 28px;padding-left:30px;} #capacity_planning .cont .left .brief .txt::after{top:16px;width:10px;height:10px;} #capacity_planning .cont .right{width: 100%;} } #institute{padding:60px 0 0;} #institute .title{font-size: 46px;font-family: "KR";color: rgb(51, 51, 51);line-height: 1;text-align:center;} #institute .top{margin:60px 0;background-color:#e6f3f8;border-radius:30px;overflow:hidden;} #institute .top .left{width:71.187%;background-color:#e6f3f8;} #institute .top .right{width:calc(100% - 71.187%);padding:20px;} #institute .top .right .name{font-size: 24px;font-family: "KR";color: rgb(51, 51, 51);line-height: 1.333;} #institute .top .right .brief{margin-top:14px;max-height:287px;overflow-y:auto;} #institute .top .right .brief .txt{margin-bottom:10px;position: relative;padding-left: 15px;font-size: 18px;font-family: "QM";color: rgb(102, 102, 102);line-height: 1.4;} #institute .top .right .brief .txt:last-child{margin-bottom:0;} #institute .top .right .brief .txt::after{content:'';position:absolute;left:0;top:10px;width:5px;height:5px;border-radius:50%;background:var(--ThemeColor);} #institute .bot{} #institute .bot .list{width:calc((100% - (4.238% * 2)) / 3);} #institute .bot .list .li{width:100%;min-height:360px;margin-bottom:20px;padding:8.335% 9.725% 9.725%;border-radius: 30px;background-color: rgb(251, 253, 253);overflow: hidden;} #institute .bot .list .li:last-child{margin-bottom: 0;} #institute .bot .left .li:nth-child(2n), #institute .bot .right .li:nth-child(2n-1){opacity: 0;pointer-events: none;} #institute .bot .list .li .tit{font-size: 24px;font-family: "KR";color: rgb(51, 51, 51);line-height: 1.25;} #institute .bot .list .li .brief{font-size: 16px;font-family: "QM";color: rgb(102, 102, 102);line-height: 1.5;margin:16px 0 0;} #institute .bot .list .li .icon{width:62px;margin-top:20px;align-self:flex-end;} #institute .bot .list .li .icon::before{content: '';padding-top:100%;} #institute .bot .pic_box{width: calc((100% - (4.238% * 2)) / 3);} #institute .bot .pic_box .pic_con{width:100%;position: sticky;top: calc(50vh - 125px);} #institute .bot .pic_box .pic{width:100%;border-radius: 30px;overflow:hidden;} #institute .bot .pic_box .pic::before{content: '';width:100%;padding-top: 100%;} #institute .bot .pic_box .pic img{opacity: 0;transition: all .3s;} #institute .bot .pic_box .pic img:first-child, #institute .bot .pic_box .pic img.cur{opacity: 1;} @media(max-width: 1024px){ #institute .bot .list .li{min-height: 285px;} #institute .bot .list .li .tit{font-size: 20px;} } @media(max-width: 750px){ #institute .title{font-size:42px;} #institute .top{display:block;} #institute .top .left{width:100%;} #institute .top .right{width:100%;display: block;padding:30px;} #institute .top .right .name{font-size:34px;} #institute .top .right .brief .txt{font-size:28px;padding-left:30px;} #institute .top .right .brief .txt::after{top: 16px;width:10px;height:10px;} #institute .bot .right, #institute .bot .pic_box{display: none;} #institute .bot .left{width: 100%;} #institute .bot .list .li{padding:30px;min-height: auto;margin-bottom:50px;} #institute .bot .left .li:nth-child(2n){opacity: 1;pointer-events: auto;} #institute .bot .list .li .tit{font-size: var(--font-sma-S);} #institute .bot .list .li .brief{font-size: var(--font-bri-S);} #institute .bot .list .li .icon{margin-top:30px;width:80px;} #institute .bot .list .li .icon img{width:100%;object-fit:contain;} } /* 新闻列表 */ .blog_bg{width:100%;background:#f7fafb url('/images/bg/blog-bg.png') no-repeat center bottom / cover;overflow:hidden;} #blog{padding:95px 0;} #blog .title{font-size: 46px;font-family: "KR";color: rgb(51, 51, 51);line-height: 1;text-align:center;} #blog .list{width:100%;margin-top:65px;} #blog .list .li{width:calc((100% - 2.543% * 2) / 3);margin:60px 2.543% 0 0; height:auto;border-radius:30px;background-color:#fff;} #blog .list .li:nth-child(-n+3){margin-top:0;} #blog .list .li:nth-child(3n){margin-right:0;} #blog .list .li .pic{width:100%;padding-top:66.578%;border-radius:30px 30px 12px 12px;} #blog .list .li .info{width:100%;padding:22px 8.04% 60px;} #blog .list .li .info .name{font-size: 22px;color:#333;line-height: 1.455;text-align: center;font-family:'QM';} #blog .list .li .info .text{font-size: 16px;color:#999;line-height: 2.125;text-align: center;font-family:'QM';margin-top:16px;} #blog .list .li .info .more{display:block;position:absolute;z-index:2;bottom:-32.5px;left:50%;transform:translateX(-50%);} #blog .list .li .info .more .btn{padding:0 20px;width:65px;height:65px;border-radius:50%;background-color:var(--ThemeColor);overflow:hidden;position:relative;} #blog .list .li .info .more .btn .txt{position:absolute;left:0;transform:translateX(-100%);opacity:0;white-space:nowrap;line-height:1;font-size: 16px;color:#fff;font-family:'QM';padding-bottom:2px;} #blog .list .li .info .more .btn .icon{width:14px;height:21px;} #blog .list .li .info .more .btn .icon .svg{width:100%;height:100%;stroke:#fff;} #blog .list .li .info .more .btn:hover{width: 180px;background-color:var(--ThemeColor2);border-radius: 12px;justify-content:space-between;} #blog .list .li .info .more .btn:hover .txt{opacity:1;transform:translateX(0);position:static;} @media screen and (max-width:750px) { #blog{padding:80px 0;} #blog .title{font-size:42px;} #blog .list .li{width:100%;margin:60px 0 0 !important;} #blog .list .li:nth-child(1){margin-top:0 !important;} #blog .list .li .info .name{font-size:32px;} #blog .list .li .info .text{font-size:26px;} #blog .list .li .info .more .btn{width:70px;height:70px;} #blog .list .li .info .more .btn:hover{width:220px;} #blog .list .li .info .more .btn .txt{font-size:26px;} } /* 新闻详情 */ .blog_detail_bg{width:100%;background:#f7fafb url('/images/bg/blog-detail-bg.png') no-repeat center bottom / cover;} #blog_detail{padding:60px 0 140px;} #blog_detail .cont{gap:30px;} #blog_detail .cont .left{width:72.035%;} #blog_detail .cont .left .tag .tag_li{border-radius: 10px;background-color: rgba(17, 176, 234, 0.2);padding:0 15px;font-size: 16px;font-family: "QM";color: rgb(102, 102, 102);line-height:45px;margin:0 10px 10px 0;} #blog_detail .cont .left .title{font-size: 46px;font-family: "KR";color: rgb(51, 51, 51);line-height: 1.304;margin:15px 0 38px;} #blog_detail .cont .left .editor *{font-size: 18px;font-family: 'QM';color: #333;line-height: 1.444;max-width:100%;} #blog_detail .cont .left .editor img{object-fit:contain;} #blog_detail .cont .right{width:270px;} #blog_detail .cont .right .box{top:var(--headHeight) !important;} #blog_detail .cont .right .page .btn{width:100%;border-bottom:1px solid rgba(0, 0, 0, .1);padding-bottom:26px;} #blog_detail .cont .right .page .btn.next{margin-top:26px;} #blog_detail .cont .right .page .btn .tip{font-size: 16px;font-family: "QM";color: rgb(153, 153, 153);line-height: 1;margin-bottom:12px;} #blog_detail .cont .right .page .btn .name{font-size: 18px;font-family: "QM";color: rgb(51, 51, 51);line-height: 1.444;} #blog_detail .cont .right .page .btn:hover{border-bottom-color:var(--ThemeColor);} #blog_detail .cont .right .page .btn:hover .name{color:var(--ThemeColor);} #blog_detail .cont .right .share{width:100%;padding:30px 0;border-bottom:1px solid rgba(0, 0, 0, .1);} #blog_detail .cont .right .share .tit{font-size: 16px;font-family: "QM";color: rgb(102, 102, 102);line-height: 1;} #blog_detail .cont .right .share .a_list{width:100%;margin-top:20px;gap:25px;} #blog_detail .cont .right .share .a_list .a{height:20px;} #blog_detail .cont .right .share .a_list .a .svg{fill:#c6c8c9;height:100%;} #blog_detail .cont .right .share .a_list .a:nth-child(1):hover .svg{fill:#3B5792;} #blog_detail .cont .right .share .a_list .a:nth-child(2):hover .svg{fill:#0966C3;} #blog_detail .cont .right .share .a_list .a:nth-child(3):hover .svg{fill:#000000;} #blog_detail .cont .right .share .a_list .a:nth-child(4):hover .svg{fill:#FF517C;} #blog_detail .cont .right .share .a_list .a:nth-child(5):hover .svg{fill:#DD1829;} #blog_detail .cont .right .share .a_list .a:nth-child(6):hover .svg{fill:#00c800;} #blog_detail .cont .right .recommendation{width:100%;margin-top:60px;} #blog_detail .cont .right .recommendation .tit{font-size: 24px;font-family: "KR";color: rgb(51, 51, 51);margin-bottom:20px;} #blog_detail .cont .right .recommendation .list .li{width:100%;margin-bottom:38px;} #blog_detail .cont .right .recommendation .list .li:last-child{margin-bottom:0;} #blog_detail .cont .right .recommendation .list .li .pic{width:100%;padding-top:66.667%;border-radius:12px;} #blog_detail .cont .right .recommendation .list .li .name{font-size: 18px;font-family: "QM";color: rgb(51, 51, 51);line-height: 1.444;margin-top:14px;} #blog_detail .cont .right .recommendation .list .li:hover .name{color:var(--ThemeColor);} @media screen and (max-width: 1024px) { #blog_detail{padding:60px 0 80px;} } @media screen and (max-width: 750px) { #blog_detail .cont{display:block;} #blog_detail .cont .left{width:100%;} #blog_detail .cont .left .tag .tag_li{font-size:26px;line-height:60px;padding:0 20px;} #blog_detail .cont .left .title{font-size:42px;} #blog_detail .cont .left .editor *{font-size:28px !important;line-height:1.6 !important;} #blog_detail .cont .right{width:100%;margin-top:80px;} #blog_detail .cont .right .page .btn .tip{font-size:26px;} #blog_detail .cont .right .page .btn .name{font-size:28px;} #blog_detail .cont .right .share .tit{font-size:26px;} #blog_detail .cont .right .share .a_list{gap:50px;margin-top:30px;} #blog_detail .cont .right .share .a_list .a{height:50px;} #blog_detail .cont .right .share .a_list .a .svg{width:auto;} #blog_detail .cont .right .recommendation .tit{font-size:34px;margin-bottom:30px;} #blog_detail .cont .right .recommendation .list .li{margin-bottom:50px;} #blog_detail .cont .right .recommendation .list .li .name{font-size:28px;} } /* 产品中心 */ .prodcuts_bg{width:100%;background:#f7fafb url('/images/bg/products-bg.png') no-repeat center bottom / cover;overflow: hidden;} #products{padding:100px 0 45px;} #products .title{font-size: 46px;font-family: "KR";color: rgb(51, 51, 51);line-height: 1;text-align:center;} #products .cont .pn{width:93px;flex-shrink: 1;margin-top:47px;} #products .cont .pn .svg {width: 18px;height: 29px;stroke: #41bfed;} #products .cont .pn.prev .svg {transform: rotate(180deg);} #products .cont .pn:hover .svg{stroke: var(--ThemeColor2);} #products .cont .container{width:100%;max-width:1180px;} #products .cont .container .slide{padding:0 3%;} #products .cont .container .slide .item .pic{width: 120px;height: 120px;padding:20px;border-radius: 50%;background-color: rgb(246, 241, 235);margin:0 auto;} #products .cont .container .slide .item .name{font-size: 18px;font-family: "QM";color: rgb(51, 51, 51);line-height: 1.667;text-align: center;margin:20px auto 0;_width:90%;} #products .cont .container .slide .item:hover .pic{background-color:#e6f3f8;} #products .cont .container .slide .item:hover .name{color:var(--ThemeColor);} #products .cont{margin:80px 0 75px;} #products .list .li{width:calc((100% - 40px) / 2);margin:0 40px 40px 0;border-radius:30px;overflow:hidden;} #products .list .li:nth-child(2n){margin-right:0;} #products .list .li .bg{width:100%;padding-top:70.175%;} #products .list .li .info{width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;padding:8.774%;} #products .list .li .info .name{font-size: 30px;font-family: "KR";color: rgb(51, 51, 51);line-height: 1.333;max-width:55%;} #products .list .li .info .more{margin-top:35px;border-radius: 12px;background-color: rgb(51, 51, 51);min-width: 180px;height: 55px;padding:0 20px;width:fit-content;} #products .list .li .info .more .txt{font-size: 16px;font-family: "QM";color: rgb(255, 255, 255);line-height: 1;} #products .list .li .info .more .icon{width: 14px;height: 21px;} #products .list .li .info .more .icon .svg {stroke: #fff;width: 100%;height: 100%;} #products .list .li .info .more:hover{background-color:var(--ThemeColor);} @media screen and (max-width: 1024px) { #products .list .li{width:calc((100% - 30px) / 2);margin:0 30px 30px 0;} #products .list .li .info .name{font-size:26px;max-width:60%;} } @media screen and (max-width: 750px) { #products .cont .pn{margin-top:60px;} #products .cont .container .slide .item .name{font-size:28px;} #products .cont .container .slide .item .pic{width:150px;height:150px;} #products .list{display: block;} #products .list .li{width:100%;margin:0 0 30px 0;} #products .list .li .info .name{font-size:36px;} #products .list .li .info .more{min-width:220px;height:70px;} #products .list .li .info .more .txt{font-size:26px;} } /* 产品分类 */ .products_category_bg{width:100%;background:#f7fafb url('/images/bg/products-category-bg.png') no-repeat center bottom / cover;overflow: hidden;} #products_category{padding:100px 0 45px;} #products_category .title{font-size: 46px;font-family: "KR";color: rgb(51, 51, 51);line-height: 1;text-align:center;} #products_category .list{gap:40px;margin-top:65px;} #products_category .list .li{width:calc((100% - (40px * 3)) / 4);} #products_category .list .li .pic{width:100%;padding-top:100%;border-radius:50%;} #products_category .list .li .pic .info{opacity:0;width:100%;position:absolute;z-index:2;left:0;bottom:0;padding:15px 20px 22px;background-color:rgba(0, 0, 0, .7);} #products_category .list .li .pic .info .tit{font-size: 20px;font-family: "QM";color: rgb(255, 255, 255);line-height: 1.6;text-align: center;margin-bottom:10px;} #products_category .list .li .pic .info .more .txt{font-size: 16px;font-family: "QM";color: rgb(255, 255, 255);line-height: 1;} #products_category .list .li .pic .info .more .icon{font-size:10px;font-weight:600;color: rgb(255, 255, 255);margin-left:10px;} #products_category .list .li .name{font-size: 20px;font-family: "QM";color: rgb(51, 51, 51);line-height: 1.6;text-align: center;margin-top:12px;} #products_category .list .li:hover .pic{border-radius:30px;} #products_category .list .li:hover .pic .info{opacity:1;} #products_category .list .li:hover .name{opacity:0;pointer-events: none;user-select: none;} @media screen and (max-width: 1024px) { #products_category .list{gap: 40px 30px;} #products_category .list .li{width:calc((100% - (30px * 3)) / 4);} } @media screen and (max-width: 750px) { #products_category{padding-top:80px;} #products_category .title{font-size:42px;} #products_category .list{margin-top:50px;justify-content: flex-start;} #products_category .list .li{width:calc((100% - 30px) / 2);} #products_category .list .li .name{font-size:30px;} #products_category .list .li .pic .info .tit{font-size:30px;} #products_category .list .li .pic .info .more .txt{font-size:26px;} #products_category .list .li .pic .info .more .icon{font-size:20px;} } #faq{padding:55px 0 145px;} #faq .title{font-size: 46px;font-family: "KR";color: rgb(51, 51, 51);line-height: 1;text-align:center;} #faq .cont{gap:30px;margin-top:65px;} #faq .cont .not_info{margin-top:0;} #faq .cont .left{width:60%;} #faq .cont .left .list .li{border-bottom: 1px solid rgba(0, 0, 0 ,0.102);} #faq .cont .left .list .li .top{width:100%;padding:20px 0;} #faq .cont .left .list .li .top .circle{border-radius: 50%;background-color: rgb(17, 176, 234);width: 8px;height: 8px;margin:10px 20px 0 0;} #faq .cont .left .list .li .top .name{flex:1;font-size: 16px;font-family: "QM";color: rgb(51, 51, 51);line-height:28px;} #faq .cont .left .list .li .top .icon{width:22.25px;height:14.25px;margin:6px 0 0 20px;} #faq .cont .left .list .li .top .icon .svg{stroke: #333;width:100%;height:100%;} #faq .cont .left .list .li .top:hover .name{color:var(--ThemeColor);} #faq .cont .left .list .li .top.cur{padding-bottom:8px;} #faq .cont .left .list .li .top.cur .name{color:var(--ThemeColor);font-family:'QSB';} #faq .cont .left .list .li .top.cur .icon .svg{stroke: var(--ThemeColor);transform: rotate(180deg);} #faq .cont .left .list .li .lower{width:100%;height:0;overflow:hidden;transition: 0.3s linear;} #faq .cont .left .list .li .lower .text{padding:0 0 20px 30px;font-size: 16px;font-family: "QM";color: rgb(51, 51, 51);line-height: 1.625;} #faq .cont .right{width:30.509%;margin-top:10px;} #faq .cont .right .pic{width:100%;padding-top:152.778%;} @media screen and (max-width: 750px) { #faq{padding-bottom:80px;} #faq .cont{display:block;margin-top:50px;} #faq .cont .left{width:100%;} #faq .cont .left .list .li .top .name, #faq .cont .left .list .li .lower .text{font-size:26px;line-height:1.6;} #faq .cont .left .list .li .top .icon, #faq .cont .left .list .li .top .circle{margin-top:16px;} #faq .cont .right{width:100%;margin-top:30px;} #faq .cont .right .pic{padding-top:100%;} #faq .cont .right .pic img{min-width:60%;} } /* 产品详情 */ .products_deatil_bg{width:100%;background:#f8fbfc url('/images/products-deatil-bg.png') no-repeat center bottom / cover;overflow:hidden;} @keyframes leftMove { from { transform: translateX(0); } to { transform: translateX(-50%); } } .aniLeft {transition: all;animation: leftMove infinite linear 5s;} .aniLeft:hover{animation-play-state: paused;} #products_deatil{padding:75px 0 60px;} #products_deatil .cont{gap:30px;} #products_deatil .cont .left{width:33.475%;padding-top:20px;} #products_deatil .cont .left .pics{padding-bottom:55px;} #products_deatil .cont .left .pics .slide{width:100%;padding-top:100%;} #products_deatil .cont .left .pics .swiper-pagination{bottom:0;} #products_deatil .cont .left .pics .swiper-pagination .swiper-pagination-bullet{width:15px;height:15px;border:2px solid #f7fafb;background:var(--ThemeColor);opacity: 0.302;margin:0 10px;transition: 0.3s;vertical-align: middle;} #products_deatil .cont .left .pics .swiper-pagination .swiper-pagination-bullet-active{border-color:var(--ThemeColor2);background:rgb(237, 109, 0);opacity:1;} #products_deatil .cont .left .item{margin-top:60px;} #products_deatil .cont .left .item::after, #products_deatil .cont .left .item::before{content:'';display:block;width:90px;height:100%;top:50%;transform:translateY(-50%);position:absolute;z-index:2;} #products_deatil .cont .left .item::after{left:-40px;background:url('/images/bg/pro-honor-mask.png') no-repeat center;} #products_deatil .cont .left .item::before{right:-40px;background:url('/images/bg/pro-honor-mask.png') no-repeat center;transform:translateY(-50%) rotate(180deg)} #products_deatil .cont .left .item .pictures{width: max-content; height: 50px; white-space: nowrap;} #products_deatil .cont .left .item .pictures .slide{width: max-content; height: 100%;} #products_deatil .cont .left .item .pictures .slide .img{display: inline-block; margin-right:20px;height:100%;} #products_deatil .cont .right{width:61.865%;} #products_deatil .cont .right .title{margin-bottom:25px;font-size: 36px;font-family: "KR";color: var(--ThemeColor);line-height: 1.389;} #products_deatil .cont .right .list{padding:10px 30px;background-color:#fff;border-radius:30px;overflow:hidden;} #products_deatil .cont .right .list .li{padding:15px 0;border-bottom:1px solid rgba(0, 0, 0 ,0.1);} #products_deatil .cont .right .list .li:last-child{border-bottom:none;} #products_deatil .cont .right .list .li .tit{width:200px;padding-right:20px;flex-shrink: 1;} #products_deatil .cont .right .list .li .tit, #products_deatil .cont .right .list .li .txt{font-size: 16px;font-family: "QM";color: rgb(102, 102, 102);line-height: 1.625;} #products_deatil .cont .right .list .li .txt{flex:1;} @media screen and (max-width: 1024px) { #products_deatil .cont .left .pics .swiper-pagination .swiper-pagination-bullet{margin:0 4px;} } @media screen and (max-width: 750px) { #products_deatil .cont{display: block;} #products_deatil .cont .left{width:100%;} #products_deatil .cont .left .pics .slide img{min-width:70%;object-fit:contain;} #products_deatil .cont .right{width:100%;margin-top:50px;} #products_deatil .cont .right .list .li .tit, #products_deatil .cont .right .list .li .txt{font-size:26px;} } #pro_features{padding:60px 0;} #pro_features .title{margin-bottom:60px;font-size: 46px;font-family: "KR";color: rgb(51, 51, 51);line-height: 1;text-align:center;} #pro_features .cont .left{width:42%;} #pro_features .cont .left .name{font-size: 32px;font-family: "KR";color: rgb(51, 51, 51);margin-bottom:5px;} #pro_features .cont .left .brief{font-size: 18px;font-family: "QM";color: rgb(102, 102, 102);line-height: 1.667;} #pro_features .cont .right{width:50%;} #pro_features .cont .right .pic{width:100%;padding-top:56.271%;border-radius:30px;} #pro_features .cont .items{bottom:15px;z-index:2;left:26%;} #pro_features .cont .items img{max-width:345px;max-height:138px;object-fit:contain;} #pro_features .bot{margin-top:75px;} #pro_features .bot .pn{width:93px;flex-shrink:1;} #pro_features .bot .pn .svg {stroke:rgba(51,51,51,0.3);} #pro_features .bot .pn.next{transform: rotate(180deg);} #pro_features .bot .pn:hover .svg{stroke: var(--ThemeColor);} #pro_features .bot .container{width:100%;max-width:1180px;} #pro_features .bot .slide .pic{width:100%;height:57px;text-align:left;} #pro_features .bot .slide .name{font-size: 18px;font-family: "QM";color: rgb(51, 51, 51);line-height: 1.444;margin-top:20px;} @media screen and (max-width: 1024px) { #pro_features .cont .items{display:none;} } @media screen and (max-width: 750px) { #pro_features .title{font-size:42px;margin-bottom:30px;} #pro_features .cont{display: block;} #pro_features .cont .left{width:100%;} #pro_features .cont .left .brief{font-size:28px;line-height:1.6;} #pro_features .cont .right{width:100%;margin-top:30px;} #pro_features .bot{margin-top:50px;} #pro_features .bot .slide .name{font-size:28px;} } #usage_instructions{padding:60px 0 20px;} #usage_instructions .title{margin-bottom:50px;font-size: 46px;font-family: "KR";color: rgb(51, 51, 51);line-height: 1;text-align:center;} #usage_instructions .list .slide{width:calc((100% - 3.39% * 3) / 4);margin:0 3.39% 40px 0;} #usage_instructions .list .slide:nth-child(4n){margin-right:0;} #usage_instructions .list .slide .pic{width:100%;padding-top:75.472%;border-radius:30px;background-color:#eef0f1;} #usage_instructions .list .slide .numb{border-radius: 50%;background-color: var(--ThemeColor2);left: 20px;top: 20px;width: 28px;height: 28px;z-index: 2;font-size: 16px;font-family: "KR";color: rgb(255, 255, 255);} #usage_instructions .list .slide .name{font-size: 16px;font-family: "QM";color: rgb(102, 102, 102);line-height: 1.625;padding:32px 20px 0;} @media screen and (max-width: 1024px) { #usage_instructions .list .slide .name{padding:20px 10px 0 ;} } @media screen and (max-width: 750px) { #usage_instructions .title{font-size:42px;} #usage_instructions .list .slide{width:calc((100% - 30px) / 2);margin:0 30px 40px 0;} #usage_instructions .list .slide:nth-child(2n){margin-right:0;} #usage_instructions .list .slide .name{font-size:26px;} #usage_instructions .list .slide .numb{font-size:24px;width:50px;height:50px;} } #ODM_OEM{padding:60px 0;} #ODM_OEM .title{font-size: 46px;font-family: "KR";color: rgb(51, 51, 51);line-height: 1;text-align:center;} #ODM_OEM .tab{padding:60px 0 55px;width:fit-content;} #ODM_OEM .tab .li{position:relative;margin-right:20px;font-size: 18px;font-family: "QM";color: rgb(51, 51, 51);line-height:60px;text-align:center;transition: 0.3s;cursor: pointer;border-radius: 16px;background-color: rgba(17, 176, 234, 0.102);min-width: 220px;width:fit-content;padding:0 20px;} #ODM_OEM .tab .li:last-child{margin-right:0;} #ODM_OEM .tab .li::before{content: "";transition: 0.3s;position: absolute;z-index:2;left:50%;transform: translateX(-50%);bottom:-10px;border-left: 6px solid transparent;border-right: 6px solid transparent;border-top: 11px solid transparent} #ODM_OEM .tab .li.cur{background-color:var(--ThemeColor2);font-family: "QSB";color: rgb(255, 255, 255);} #ODM_OEM .tab .li.cur::before{border-top-color:var(--ThemeColor2);} #ODM_OEM .bind .con .box .tip{font-size: 22px;font-family: "QSB";color: rgb(51, 51, 51);line-height: 1.2;margin-bottom:20px;} #ODM_OEM .bind .con .box .li{padding:20px;background-color:#fbfdfd;border-radius:30px;} #ODM_OEM .bind .con .box .li .pic{width:100%;padding-top:80.82%;} #ODM_OEM .bind .con .box .li .pic img{mix-blend-mode: multiply;} #ODM_OEM .bind .con .box .li .name{width:100%;text-align:center;font-size: 18px;font-family: "QM";color: rgb(51, 51, 51);margin-top:10px;} #ODM_OEM .bind .con .box .li .info{border-radius: 30px;background-color: rgb(255, 255, 255);box-shadow: 0px 0px 30px 0px rgba(17, 176, 234, 0.1);position: absolute;transform: translate(-50%, -50%) scale(0);left: 50%;top: 50%;width: 460px;z-index: 2;padding:35px 40px;} #ODM_OEM .bind .con .box .li .info .tit{font-size: 22px;font-family: "QSB";color: rgb(17, 176, 234);line-height: 1.273;} #ODM_OEM .bind .con .box .li .info .txt{font-size: 16px;font-family: "QM";color: rgb(102, 102, 102);line-height: 1.75;margin-top:15px;} #ODM_OEM .bind .con .box .li:hover .info{transform: translate(-50%, -50%) scale(1);} #ODM_OEM .bind .con .box .left{width:calc(100% - 212px - 30px);flex:1;} #ODM_OEM .bind .con .box .left .list{gap:30px;} #ODM_OEM .bind .con .box .left .list .li{width:calc((100% - 30px * 3) / 4);} #ODM_OEM .bind .con .box.open .left .list .li{width:calc((100% - 30px * 4) / 5);} #ODM_OEM .bind .con .box .right{width:212px;margin-left:30px;} @media screen and (max-width: 1536px) and (min-width: 1025px) { #ODM_OEM .bind .con .box .left .list .li:nth-child(4n+1) .info, #ODM_OEM .bind .con .box.open .left .list .li:nth-child(5n+1) .info{transform: translate(0,-50%) scale(0);left:0;} #ODM_OEM .bind .con .box.open .left .list .li:nth-child(5n) .info, #ODM_OEM .bind .con .box .right .li .info{transform: translate(0,-50%) scale(0);right:0;left:auto;} #ODM_OEM .bind .con .box.open .left .list .li:nth-child(5n):hover .info, #ODM_OEM .bind .con .box.open .left .list .li:nth-child(5n+1):hover .info, #ODM_OEM .bind .con .box .left .list .li:nth-child(4n+1):hover .info, #ODM_OEM .bind .con .box .right .li:hover .info{transform: translate(0, -50%) scale(1);} } @media screen and (max-width: 1024px){ #ODM_OEM .bind .con .box{display:block;} #ODM_OEM .bind .con .box .left{width:100%;} #ODM_OEM .bind .con .box .left .list{gap:28px;} #ODM_OEM .bind .con .box .left .list .li{width:calc((100% - 28px * 3) / 4);} #ODM_OEM .bind .con .box.open .left .list .li{width:calc((100% - 28px * 3) / 4);} #ODM_OEM .bind .con .box .right{margin:30px 0 0;} } @media screen and (max-width: 1024px) and (min-width: 751px) { #ODM_OEM .bind .con .box .left .list .li:nth-child(4n) .info{transform: translate(0,-50%) scale(0);right:0;left:auto;} #ODM_OEM .bind .con .box .left .list .li:nth-child(4n+1) .info, #ODM_OEM .bind .con .box .right .li .info{transform: translate(0,-50%) scale(0);right:auto;left:0;} #ODM_OEM .bind .con .box .left .list .li:nth-child(4n):hover .info, #ODM_OEM .bind .con .box .left .list .li:nth-child(4n+1):hover .info, #ODM_OEM .bind .con .box .right .li:hover .info{transform: translate(0, -50%) scale(1);} } @media screen and (max-width: 750px) { #ODM_OEM .tab .li{font-size:28px;} #ODM_OEM .bind .con .box .tip{font-size:32px;} #ODM_OEM .bind .con .box .li .name{font-size:28px;} #ODM_OEM .bind .con .box .li .info .tit{font-size:32px;} #ODM_OEM .bind .con .box .li .info .txt{font-size:26px;line-height:1.6;} #ODM_OEM .bind .con .box .left .list{gap:30px;} #ODM_OEM .bind .con .box .left .list .li{width:calc((100% - 30px) / 2);} #ODM_OEM .bind .con .box.open .left .list .li{width:calc((100% - 30px) / 2);} #ODM_OEM .bind .con .box .right{width:330px;} #ODM_OEM .bind .con .box .left .list .li:nth-child(2n) .info{transform: translate(0,-50%) scale(0);right:0;left:auto;} #ODM_OEM .bind .con .box .left .list .li:nth-child(2n+1) .info, #ODM_OEM .bind .con .box .right .li .info{transform: translate(0,-50%) scale(0);right:auto;left:0;} #ODM_OEM .bind .con .box .left .list .li:nth-child(2n):hover .info, #ODM_OEM .bind .con .box .left .list .li:nth-child(2n+1):hover .info, #ODM_OEM .bind .con .box .right .li:hover .info{transform: translate(0, -50%) scale(1);} } #pro_recommend{padding:60px 0 80px;} #pro_recommend .title{margin-bottom:60px;font-size: 46px;font-family: "KR";color: rgb(51, 51, 51);line-height: 1;text-align:center;} #pro_recommend .list{gap:40px;} #pro_recommend .list .slide{width:calc((100% - 40px * 3) / 4);} #pro_recommend .list .slide .pic{width:100%;padding-top:100%;border-radius:50%;} #pro_recommend .list .slide .pic .info{opacity:0;width:100%;position:absolute;z-index:2;left:0;bottom:0;padding:15px 20px 22px;background-color:rgba(0, 0, 0, .7);} #pro_recommend .list .slide .pic .info .tit{font-size: 20px;font-family: "QM";color: rgb(255, 255, 255);line-height: 1.6;text-align: center;margin-bottom:10px;} #pro_recommend .list .slide .pic .info .more .txt{font-size: 16px;font-family: "QM";color: rgb(255, 255, 255);line-height: 1;} #pro_recommend .list .slide .pic .info .more .icon{font-size:10px;font-weight:600;color: rgb(255, 255, 255);margin-left:10px;} #pro_recommend .list .slide .name{font-size: 20px;font-family: "QM";color: rgb(51, 51, 51);line-height: 1.6;text-align: center;margin-top:12px;} #pro_recommend .list .slide:hover .pic{border-radius:30px;} #pro_recommend .list .slide:hover .pic .info{opacity:1;} #pro_recommend .list .slide:hover .name{opacity:0;pointer-events: none;user-select: none;} @media screen and (max-width: 1024px) { #pro_recommend .list{gap:40px 30px;} #pro_recommend .list .slide{width:calc((100% - 30px * 3) / 4);} } @media screen and (max-width: 750px) { #pro_recommend .title{font-size:42px;margin-bottom:50px;} #pro_recommend .list{justify-content: flex-start;} #pro_recommend .list .slide{width:calc((100% - 30px) / 2);} #pro_recommend .list .slide .name{font-size:30px;} #pro_recommend .list .slide .pic .info .tit{font-size:30px;} #pro_recommend .list .slide .pic .info .more .txt{font-size:26px;} #pro_recommend .list .slide .pic .info .more .icon{font-size:20px;} } /* ODM Advantage */ .advantage_bg{width:100%;background:#f7fafb url('/images/bg/advantage-bg.png') no-repeat center bottom / cover;overflow:hidden;} #advantage{padding:100px 0 60px;} #advantage .cont .left{width:50%;} #advantage .cont .left .title{font-size: 46px;font-family: "KR";color: rgb(51, 51, 51);line-height: 1.304;} #advantage .cont .left .brief{font-size: 18px;font-family: "QM";color: rgb(102, 102, 102);line-height: 1.889;margin:12px 0 50px;} #advantage .cont .left .list{gap:50px;} #advantage .cont .left .list .li{width:calc(50% - 25px);} #advantage .cont .left .list .li .icon{width: 60px;height: 60px;} #advantage .cont .left .list .li .tit{font-size: 22px;font-family: "QSB";color: var(--ThemeColor);line-height: 1.364;margin:22px 0 16px;} #advantage .cont .left .list .li .txt{font-size: 18px;font-family: "QM";color: rgb(102, 102, 102);line-height: 1.667;} #advantage .cont .right{width:calc(50% - 30px);} #advantage .cont .right .pic img{max-height:430px;object-fit: contain;} @media screen and (max-width: 1024px) { #advantage .cont .left .list{gap:30px;} #advantage .cont .left .list .li{width:calc(50% - 15px);} } @media screen and (max-width: 750px) { #advantage{padding-top:80px;} #advantage .cont{display: block;} #advantage .cont .left{width:100%;} #advantage .cont .left .title{font-size:42px;} #advantage .cont .left .brief{font-size:28px;margin-bottom:30px;} #advantage .cont .right{width:100%;margin-top:50px;} #advantage .cont .left .list{gap:30px;} #advantage .cont .left .list .li{width:100%;} #advantage .cont .left .list .li .tit{font-size:32px;} #advantage .cont .left .list .li .txt{font-size:28px;} } #manufacturing_strength{padding:60px 0;} #manufacturing_strength .title{font-size: 46px;font-family: "KR";color: rgb(51, 51, 51);line-height: 1;text-align: center;} #manufacturing_strength .brief{font-size: 18px;font-family: "QM";color: rgb(102, 102, 102);line-height: 1.889;text-align: center;margin:20px 0 55px;} #manufacturing_strength .cont .bind{width:calc(50% - 40px);} #manufacturing_strength .cont .bind .con .pic{width:100%;padding-top:100%;} #manufacturing_strength .cont .tab{width:50%;position:relative;} #manufacturing_strength .cont .tab::after{content:'';position:absolute;left:12px;top:40px;z-index:1;width:100px;height:460px;background: url('/images/bg/manufacturing-line.png') no-repeat center;} #manufacturing_strength .cont .tab .li{display:flex;align-items:flex-start;margin-bottom:50px;cursor: pointer;position:relative;z-index:2;} #manufacturing_strength .cont .tab .li:last-child{margin-bottom:0;} #manufacturing_strength .cont .tab .li:nth-child(2n){padding-left:10.17%;} #manufacturing_strength .cont .tab .li .numb{margin-right:5.085%;border-radius: 50%;background-color: var(--ThemeColor);width: 60px;height: 60px;font-size: 22px;font-family: "QSB";color: rgb(255, 255, 255);} #manufacturing_strength .cont .tab .li .info{flex:1;} #manufacturing_strength .cont .tab .li .info .tit{font-size: 22px;font-family: "QSB";color: rgb(51, 51, 51);margin-bottom:15px;max-height:56px;overflow-y:auto;} #manufacturing_strength .cont .tab .li .info .txt{font-size: 18px;font-family: "QM";color: rgb(102, 102, 102);line-height: 1.667;height:120px;overflow-y:auto;} #manufacturing_strength .cont .tab .li.cur .numb{background-color: var(--ThemeColor2);} #manufacturing_strength .cont .tab .li.cur .info .tit{color: var(--ThemeColor2);} @media screen and (max-width: 750px){ #manufacturing_strength .title{font-size:42px;} #manufacturing_strength .brief{font-size:28px;margin-bottom:30px;} #manufacturing_strength .cont{display:block;} #manufacturing_strength .cont .bind{width:100%;} #manufacturing_strength .cont .bind .con .pic img{width:100%;object-fit:contain;} #manufacturing_strength .cont .tab{width:100%;margin-top:30px;} #manufacturing_strength .cont .tab .li:nth-child(2n){padding-left:0;} #manufacturing_strength .cont .tab .li .info .tit{font-size:32px;max-height: none;} #manufacturing_strength .cont .tab .li .info .txt{font-size:28px;height: auto;} #manufacturing_strength .cont .tab::after{display:none;} } #supply_chain_strength{padding: 60px 0;} #supply_chain_strength .title{font-size: 46px;font-family: "KR";color: rgb(51, 51, 51);line-height: 1;text-align: center;} #supply_chain_strength .brief{font-size: 18px;font-family: "QM";color: rgb(102, 102, 102);line-height: 1.889;text-align: center;margin:20px 0 35px;} #supply_chain_strength .cont{width:fit-content;margin:0 auto;z-index:2} #supply_chain_strength .letter{left: 48%;bottom:22%;transform: translate(-50%, 0);z-index:0;background: url('/images/bg/letter.png') no-repeat center / contain;width:100%;height:260px;text-align:center;} #supply_chain_strength .li .icon{width:25px;height:25px;} #supply_chain_strength .li .icon .svg{fill:var(--ThemeColor);width: 100%;height: 100%;} #supply_chain_strength .li .name{opacity:0;pointer-events: none;left:calc(100% + 6px);top:50%;transform:translateY(-50%);font-size: 16px;font-family: "QM";color: rgb(34, 34, 34);width:130px;} #supply_chain_strength .li.tl .name{text-align:right;left:auto;right:calc(100% + 6px);} #supply_chain_strength .li:hover, #supply_chain_strength .li.cur{z-index:3;} #supply_chain_strength .li.cur .name{color:var(--ThemeColor2);font-family:'QSB';opacity:1;pointer-events: all;} #supply_chain_strength .li.cur .icon .svg{fill:var(--ThemeColor2);} @media (any-hover: hover){ #supply_chain_strength .li:hover .name{color:var(--ThemeColor2);opacity:1;pointer-events: all;} #supply_chain_strength .li:hover .icon .svg{fill:var(--ThemeColor2);} } /* 弹出层 */ #supply_chain_strength .map_info{transition:all 0.3s ease;position:absolute;top:42%;left:51%;z-index:5;border-radius: 30px;background-color: rgb(255, 255, 255);box-shadow: 0px 0px 30px 0px rgba(17, 176, 234, 0.1);width: 430px;overflow:hidden;padding:35px 40px;} #supply_chain_strength .map_info .name{font-size: 20px;font-family: "QSB";color: var(--ThemeColor2);margin-bottom:10px;} #supply_chain_strength .map_info .text{font-size: 16px;font-family: "QM";color: #666;line-height: 1.75;} #supply_chain_strength .map_info .text span{color:#333;} @media screen and (max-width: 1024px){ #supply_chain_strength .letter{left:50%;} } @media screen and (max-width: 750px){ #supply_chain_strength .title{font-size:42px;} #supply_chain_strength .brief{font-size:28px;} #supply_chain_strength .map_info{display:none;} #supply_chain_strength .container{display:block;} #supply_chain_strength .container .swiper-button-prev{left:0;color: var(--ThemeColor);} #supply_chain_strength .container .swiper-button-next{right:0;color: var(--ThemeColor);} #supply_chain_strength .slide{border-radius: 30px;background-color: rgb(255, 255, 255);box-shadow: 0px 0px 30px 0px rgba(17, 176, 234, 0.1);padding:30px;height:auto;} #supply_chain_strength .slide .mb_name{font-size: 30px;font-family: "QSB";color: var(--ThemeColor2);margin-bottom:10px;} #supply_chain_strength .slide .mb_text{font-size: 26px;font-family: "QM";color: #666;line-height: 1.6;} #supply_chain_strength .slide .mb_text span{color:#333;} } #R_D_strength{padding: 60px 0;} #R_D_strength .title{font-size: 46px;font-family: "KR";color: rgb(51, 51, 51);line-height: 1;text-align: center;} #R_D_strength .brief{font-size: 18px;font-family: "QM";color: rgb(102, 102, 102);line-height: 1.889;text-align: center;margin:20px 0 45px;} #R_D_strength .top .bind .con{position: relative;border-radius:30px;overflow:hidden;} #R_D_strength .top .bind .con .pic{width:100%;padding-top:35.593%;} #R_D_strength .top .bind .con .mask{left:0;bottom:0;width:100%;height:270px;z-index:1;} #R_D_strength .top .bind .con .info{position:absolute;left:0;bottom:0;z-index:2;width:100%;padding:0 20px 30px;text-align:center;} #R_D_strength .top .bind .con .info .tit{font-size: 22px;font-family: "QSB";color: rgb(255, 255, 255);line-height: 1.364;} #R_D_strength .top .bind .con .info .txt{font-size: 18px;font-family: "QM";color: rgb(255, 255, 255);line-height: 1.667;margin-top:18px;} #R_D_strength .top .tab{gap: 20px;margin-top:35px;} #R_D_strength .top .tab .li{min-width:180px;width:fit-content;position:relative;font-size: 18px;font-family: "QM";color: rgb(102, 102, 102);text-align:center;padding-bottom:14px;cursor: pointer;transition: 0.3s;} #R_D_strength .top .tab .li::after{content:'';transition: 0.3s;background-color: rgba(102, 102, 102 ,0.2);position: absolute;left: 0;bottom: 0;width: 100%;height: 3px;z-index: 2;} #R_D_strength .top .tab .li.cur{color: var(--ThemeColor2);} #R_D_strength .top .tab .li.cur::after{background-color: var(--ThemeColor2);} #R_D_strength .bot{padding:100px 0 20px;} #R_D_strength .bot .item{padding:0 1.696%;} #R_D_strength .bot .item .img{width:110px;margin-bottom:25px;} #R_D_strength .bot .item .img .pic{width:100%;padding-top:100%;border-radius: 50%;} #R_D_strength .bot .item .name{font-size: 16px;font-family: "QM";color: rgb(51, 51, 51);line-height: 1.375;text-align: center;} #R_D_strength .bot .swiper-pagination{bottom:0;} #R_D_strength .bot .swiper-pagination .swiper-pagination-bullet{width:6px;height:6px;background:#41bfed;margin:0 2.5px;transition: 0.3s;} #R_D_strength .bot .swiper-pagination .swiper-pagination-bullet-active{margin:0 12.5px;} @media screen and (max-width: 750px){ #R_D_strength .title{font-size:42px;} #R_D_strength .brief{font-size:28px;margin-bottom:30px;} #R_D_strength .top .bind .con .pic{padding-top: 80%;} #R_D_strength .top .bind .con .info .tit{font-size:32px;} #R_D_strength .top .bind .con .info .txt{font-size:28px;line-height:1.4;} #R_D_strength .top .tab .li{font-size:28px;} #R_D_strength .bot{padding-top:50px;} /* #R_D_strength .bot .item{width: calc(100% / 2);} */ #R_D_strength .bot .item .img{width:180px;} #R_D_strength .bot .item .name{font-size:26px;} #R_D_strength .bot .swiper-pagination .swiper-pagination-bullet{width:10px;height:10px;} } /* 联系我们 */ .contact_bg{width:100%;background:#f7fafb url('/images/bg/contact-bg.png') no-repeat center bottom / cover;overflow:hidden;} #contact{padding:80px 0 65px;} #contact .title{font-size: 46px;font-family: "KR";color: rgb(51, 51, 51);line-height: 1;text-align:center;} #contact .cont{padding:75px 0 0;} #contact .cont .list{width:33.899%;margin-right:20px;} #contact .cont .list .li{margin-bottom:40px;} #contact .cont .list .li:last-child{margin-bottom:0;} #contact .cont .list .li .icon{border-radius: 50%;width: 70px;height: 70px;background-color: rgb(214, 237, 245);margin-right:20px;} #contact .cont .list .li:nth-child(2) .icon{background-color:#dbf2d4;} #contact .cont .list .li:nth-child(3) .icon{background-color:#eed7eb;} #contact .cont .list .li:nth-child(4) .icon{background-color:#f5e8dc;} #contact .cont .list .li .info .tit{font-size: 18px;font-family: "QM";color: rgb(102, 102, 102);line-height: 2;} #contact .cont .list .li .info .txt{font-size: 22px;font-family: "QM";color: rgb(51, 51, 51);line-height: 1.364;} #contact .cont .map{width:calc(100% - 33.899% - 20px);} #contact .cont .map .img{width:100%;padding-top:66.447%;} @media screen and (max-width: 750px) { #contact .title{font-size:42px;} #contact .cont{padding-top:50px;display:block;} #contact .cont .list{width:100%;margin-right:0;margin-bottom:50px;} #contact .cont .list .li .info .tit{font-size:28px;} #contact .cont .list .li .info .txt{font-size:32px;} #contact .cont .map{width:100%;} }